<template>
  <div>
    <span class="block">
      <!-- <span class="demonstration">Emits Date object</span> -->
      <!-- <div class="demonstration">Value: {{ value1 }}</div> -->
      <el-date-picker
        v-model="value1"
        type="date"
        placeholder="开始日期"
        format="YYYY/MM/DD"
      /> </span
    >至
    <span class="block">
      <!-- <span class="demonstration">Emits Date object</span> -->
      <!-- <div class="demonstration">Value: {{ value1 }}</div> -->
      <el-date-picker
        v-model="value1"
        type="date"
        placeholder="结束日期"
        format="YYYY/MM/DD"
      />
    </span>
    <el-button type="primary" round>搜索</el-button>
    <div class="form">
      <h1>老年医养照护中心</h1>
      <p>医疗消费明细</p>
      <table style="width: 100%;">
        <tr >
          <td>入住号：23232323</td>
          <td>姓名：李建刚</td>
          <td>性别：女</td>
          <td>护照等级：四级护照</td>
          <td>床位：21床</td>
        </tr>
        <tr>
            <td colspan="2">家属姓名：李建铁</td>
            <td colspan="2">家属性别：女</td>
            <td>联系电话：13000001234</td>
        </tr>
        <tr>
            <td colspan="5">消费日期：2022-12-01至2023-02-12</td>
        </tr>
        <tr style="color: red;">
            <td colspan="3">医疗保障金总支出:23232，4元，其中特殊护理之处:232元</td>
            <td colspan="2">医保总支出:12元。其中特殊护理支出:12元</td>
        </tr>
        <tr>
            <td colspan="3">医疗支出总金额</td>
            <td colspan="2" style="color: red;">232元</td>
        </tr>
        <tr>
            <td colspan="4" style="font-weight: 700;">医疗保障金支出</td>
            <td style="font-weight: 700;">222元</td>
        </tr>
      </table>
      <table style="width: 100%;">
        <tr style="background-color: #f3f6f9;">
            <td>时间</td>
            <td>项目</td>
            <td>金额</td>
            <td>备注</td>
            <td>操作</td>
        </tr>
        <tr>
            <td>2022-12-12 12:12:12</td>
            <td>细谈护理，数量：1，单位：次，￥6</td>
            <td>6</td>
            <td></td>
            <td>冲销</td>
        </tr>
        <tr>
            <td>2022-12-12 12:12:12</td>
            <td>细谈护理，数量：1，单位：次，￥6</td>
            <td>6</td>
            <td></td>
            <td>冲销</td>
        </tr>
        <tr>
            <td>2022-12-12 12:12:12</td>
            <td>细谈护理，数量：1，单位：次，￥6</td>
            <td>6</td>
            <td></td>
            <td>冲销</td>
        </tr>
        <tr>
            <td colspan="4" style="font-weight: 700;">医保支出</td>
            <td style="font-weight: 700;">222元</td>
        </tr>
      </table>
      <table style="width: 100%;">
        <tr>
            <td>时间：</td>
            <td>项目</td>
            <td>金额</td>
        </tr>
        <tr>
            <td>2022-12-12 12:12:12</td>
            <td>细谈护理，数量：1，单位：次，￥6</td>
            <td>
                6
            </td>
        </tr>
        <tr>
            <td>2022-12-12 12:12:12</td>
            <td>细谈护理，数量：1，单位：次，￥6</td>
            <td>
                6
            </td>
        </tr>
        <tr>
            <td colspan="1.5">明细查询时间：2022-10-21 19:34</td>
            <td>操作人：李祥祥</td>
        </tr>

      </table>
    </div>
  </div>
</template>

<script setup>
</script>

<style  scoped>
.block {
  margin: 10px 20px;
}
.form {
  width: 800px;
  height: 820px;
  margin: auto;
  border: 1px solid gray;
  margin-top: 20px;
}
.form h1 {
  text-align: center;
  line-height: 80px;
  background: #f3f6f9;
  border-bottom: 1px solid gray;
}
.form p {
  text-align: center;
  line-height: 50px;
  background: #f3f6f9;
  border-bottom: 1px solid gray;
}
table,
tr,
th,
td {

  border: 1px solid #f3f6f9;
  border-collapse: collapse;
  padding: 15px 20px;
  font-size: 12px;
}
</style>